<!doctype html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>v-if</title>
</head>
<body>
    <!--这是view-->
    <div id="example-2">
        <p v-if="greeting">hello Vue.js</p>
        <button type="button" v-on:click="toggle">{{greetBtn}}</button>
    </div>

    <script src="../lib/vue.js"></script>
    <script>
        var exampleVM2 = new Vue({
            el : "#example-2",
            data : {
                greeting : true,
                greetBtn : "隐藏"
            },
            methods : {
                toggle : function(){
                    var staus = this.greeting;
                    this.greeting = !staus;
                    if(this.greeting){
                        this.greetBtn = "隐藏";
                    } else {
                        this.greetBtn = "显示";
                    }
                }
            }
        })

    </script>
</body>
</html>